<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8">
	<style type="text/css">
		.box{
			width: 1000px;
			height: 1000px;
			background: #ddd;
			margin: 0 auto;
		}
		.box1{
			width: 850px;
			height: 310px;
			margin: 0 auto;
			margin-top: 50px;
		}
		.top{
			width: 850px;
			height: 75px;
			background: #fff;
			margin:0 auto;
			text-align: center;
			line-height: 50px;
		}
		.left{
			width: 210px;
			height: 310px;
			background: #fff;
			color:#808080;
			text-align: center;
			float: left;
		}
		li{
			background: #21b9c6;
			list-style: none;
			height: 32px;
			width: 100px;
			margin: 0 auto;
			line-height: 30px;
			border-radius: 4px;
			margin-left: 19px;
		}
		.mid{
			background: #fff;
			width:220px;
			height: 270px;
			margin-left: 45px;
			float: left;
		}
		.right{
			background: #fff;
			width: 325px;
			height: 270px;
			float: left;
			margin-left: 45px;
		}
		.a1{
			width: 160px;
			height: 45px;
			background: #ddd;
			margin-top: 20px;
			margin-left: 25px;
			line-height: 45px;
			border-radius: 4px;
			text-align: center;
		}
		.a2{
			width: 160px;
			height: 45px;
			background: #21b9c6;
			color: #fff;
			margin-top: 20px;
			margin-left: 48px;
			line-height: 45px;
			border-radius: 4px;
			text-align: center;
		}
		.a3{
			width: 160px;
			height: 45px;
			background: #ddd;
			margin-top: 20px;
			margin-left: 25px;
			line-height: 45px;
			border-radius: 4px;
			text-align: center;

		}
		.a4{
			width: 220px;
			height: 45px;
			margin :0 auto;
			margin-top: 28px;
			line-height: 45px;
			margin-left: 10px;
		}
		.box2{
			width: 850px;
			height: 310px;
			margin: 0 auto;
			margin-top: 5px;
		}
		.left1{
			width:220px;
			height: 270px;
			background: #fff;
			margin-top: 35px;
			float: left;
		}
		.a5{
			text-align: center;
			margin-top: 15px;
		}
		.mid1{
			width: 220px;
			height: 310px;
			background: #fff;
			float: left;
			margin-left: 35px;
		}
		.a6{
			margin-left: 15px;
		}
		.a7{
			margin-left: 15px;
		}
		.a8{
			margin-left: 15px;
		}
		.a9{
			margin-left: 15px;
		}
		.box3{
			width: 325px;
			height: 310px;
			float: left;
			margin-left: 44px;
		}
		.left2{
			width: 150px;
			height: 140px;
			float: left;
		}
		.right2{
			width: 150px;
			height: 140px;
			float: left;
			margin-left: 20px;
			background:  #21b9c6;
		}
		.a10{
			margin-top: 10px;
			text-align: center;
		}
	</style>
</head>
<body>
	<div class="box">
		<div class="top">
			<img src="3.jpg" style="float: right;">
				<h3>
					<font face="黑体">Dashboard</font>
				</h3>
				<font size=""></font>
		</div>
		<div class="box1">
			<div class="left">
			<img src="4.jpg" style="margin-top: 25px;">
				<font face="黑体">
					<h3>
					    <p>
						<font color="black">Zach Dunes</font>
					    </p>
					</h3>
					<p>
						<font>
					Proin cuisus dignissim nouo id gravida Pulvinar idngma allquel inleger eleiend dignissim mauris
				</font>
					<font color="#fff">
						</p>
					<p>
						<ul>
						<li>PROFLIE</li>
					</ul>
					</p>
					</font>
		</div>
		<div class="mid">
			<div class="a1">
				Happy new year
			</div>
			<div class="a2">
				Thank very much
			</div>
			<div class="a3">
				 good health
			</div>
			<div class="a4">
				Type your massage
			</div>
		</div>
		<div class="right">
			<img src="6.jpg">
		</div>
	</div>
	<div class="box2">
		<div class="left1">
			<div class="a5">
				<h3>
					SIGN TO YOUR ACCOUNT
				</h3>
			</div>
			<img src="8.jpg" width="180" style="margin-left: 18px;">
			<ul>
						<li style="width: 140px; margin-left: 2px; text-align: center; color: #fff;">SIGN IN</li>
					</ul>
					<font size="" style="margin-left: 10px; margin-top: 20px;">
                    If you have any questions,
                    </font>
		</div>
		<div class="mid1">
			<div class="a6">
				<h4>
					GET IN TOUCH
				</h4>
			</div>
			<form>
				<tr>
					<p>
						<div class="a7">
							<td>NAME·</td>
						</div>
					</p>
					<td>
						<input type="text" name="" placeholder="   Connos Muroye" style="margin-left: 25px; height: 25px;">
					</td>
				</tr>
				<tr>
					<p>
						<div class="a8">
							<td>MEALL·</td>
						</div>
					</p>
					<td>
						<input type="text" name=""  style="margin-left: 25px; height: 25px;">
					</td>
				</tr>
				<tr>
					<p>
						<div class="a9">
							<td>PHONE MUNEBEA·</td>
						</div>
					</p>
					<td>
						<input type="text" name=""  style="margin-left: 25px; height: 25px;">
					</td>
				</tr>
			</form>
		</div>
		<div class="box3">
			<div class="left2">
				<img src="10.jpg" style="width: 150px;height: 140px;">
			</div>
			<div class="right2">
				<img src="9.jpg" style="width: 80px; margin-left: 40px; margin-top:15px; ">
				<div class="a10">
					<font color="#fffff">
						72° Brooklun
					</font>
				</div>
			</div>
			<div class="end">
				<img src="11.jpg" style="margin-top: 35px; width: 325px; height: 130px;">
			</div>
		</div>
	</div>
	</div>
</body>
</html>
